<template>
  <!-- 活动列表 -->
  <div class="activityList">
    <MyHead title="活动列表" :flag="true"></MyHead>
    <div style="background-color: #f4f4f4">
      <van-tabs
        v-model="activeName"
        background="#FFEBEB"
        title-active-color="#F57373"
        @change="changeActive"
        sticky
      >
        <!-- 热门活动 -->
        <van-tab title="热门活动" name="a" class="tab-style">
          <div class="list-box" v-if="hotlList.length > 0">
            <load-more
              :loadmoredata="loadmoredata"
              @refresh="refreshhotlist"
              v-if="activeName == 'a'"
            >
              <hot-list :list="hotlList"></hot-list>
            </load-more>
          </div>
          <div v-else>
            <van-empty description="暂无活动" />
          </div>
        </van-tab>
        <!-- 地区活动 -->
        <van-tab title="地区活动" name="b" class="tab-style">
          <div class="allregions">
            <div class="school-name" @click="goDistrict">
              查看所有地区疾控单位>>
            </div>
          </div>
          <div class="district-box" v-if="districtList.length > 0">
            <load-more
              :loadmoredata="getDistrictList"
              @refresh="refresDistrictList"
              v-if="activeName == 'b'"
            >
              <regional-activity
                :districtList="districtList"
              ></regional-activity>
            </load-more>
          </div>
          <div v-else>
            <van-empty description="暂无活动" />
          </div>
        </van-tab>
        <!-- 校园活动 -->
        <van-tab title="校园活动" name="c" class="tab-style">
          <div class="allregions flexb">
            <div @click="goAllSchool" class="school-name flexc">
              查看所有高校>>
            </div>
            <div class="btn-style">
              <van-button color="#FFA32B" size="small" @click="goMySchool"
                >我的学校</van-button
              >
            </div>
          </div>
          <div class="district-box" v-if="campusList.length > 0">
            <load-more
              :loadmoredata="getcampusList"
              @refresh="refreshCampusList"
              v-if="activeName == 'c'"
            >
              <school-activity :campusList="campusList"></school-activity>
            </load-more>
          </div>
          <div v-else>
            <van-empty description="暂无活动" />
          </div>
        </van-tab>
      </van-tabs>
    </div>
    <MyTab></MyTab>
  </div>
</template>
  
<script>
import SchoolActivity from "./SchoolActivity";
export default {
  components: { SchoolActivity },
  data() {
    return {
      activeName: "a",
      hotlList: [], //热门活动
      districtList: [], //地区活动
      campusList: [], //校园活动
      activeType: null,

      openid: "", //取值
      stateType: "", //活动状态
      timestamp: 0, //接口反馈的时间戳

      level: "4", //线下活动类别
      params: {
        //热门
        pages: 1,
        limits: 10,
        total: 0,
      },
      aparams: {
        //地区
        pages: 1,
        limits: 10,
        total: 0,
      },
      sparams: {
        //学校
        pages: 1,
        limits: 10,
        total: 0,
      },
    };
  },
  computed: {},
  methods: {
    /*我的学校*/
    goMySchool() {
      this.$router.push({
        name: "schoolindex",
        query: {
          depart_code: this.userInfo.depart_code,
          name: this.userInfo.name,
        },
      });
    },
    refreshhotlist() {
      this.params.pages = 1; //
      this.getHotList();
    },
    /*热门活动分页*/
    async loadmoredata(loaddata, nodata) {
      this.params.pages += 1; //
      if (
        this.params.pages > Math.ceil(this.params.total / this.params.limits)
      ) {
        nodata();
      } else {
        let res = await this.$ajax.userActListHost({
            openid: this.openid,
            ...this.params,
          });
          if (res.code == 1) {
            // 有新数据
            loaddata();
            this.$nextTick(() => {
              this.hotlList = this.hotlList.concat(res.data);
            });
          } else {
            this.$toast(res.msg);
            this.$router.push({ name: "index" });
          }
        // if (this.userInfo.depart_code) {
        //   // 有用户信息身份
        //   let res = await this.$ajax.userActListHost({
        //     openid: this.openid,
        //     ...this.params,
        //   });
        //   if (res.code == 1) {
        //     // 有新数据
        //     loaddata();
        //     this.$nextTick(() => {
        //       this.hotlList = this.hotlList.concat(res.data);
        //     });
        //   } else {
        //     this.$toast(res.msg);
        //     this.$router.push({ name: "index" });
        //   }
        // } else {
        //   // 没有用户信息身份
        //   let res = await this.$ajax.ActivityListHost({
        //     openid: this.openid,
        //     ...this.params,
        //   });
        //   if (res.code == 1) {
        //     // 有新数据
        //     loaddata();
        //     this.$nextTick(() => {
        //       this.hotlList = this.hotlList.concat(res.data);
        //     });
        //   } else {
        //     this.$toast(res.msg);
        //     this.$router.push({ name: "index" });
        //   }
        // }
      }
    },
    /*点击切换tab*/
    changeActive(v) {
      console.log(v);
      if (v == "a") {
        this.params.pages = 1; // 每次 切换页面 从第一页开始
        this.getHotList(); //热门活动列表
      } else if (v == "b") {
        this.aparams.pages = 1;
        this.onDistrictList(); //地区
      } else if (v == "c") {
        this.sparams.pages = 1;
        this.onCampusList(); //校园
      }
    },
    /*热门活动列表*/
    async getHotList() {
      let res = await this.$ajax.userActListHost({
        openid: this.openid,
        ...this.params,
      });
      if (res.code == 1) {
        this.hotlList = res.data;
        this.$set(this.params, "total", res.total);
      } else {
        this.$toast(res.msg);
        this.$router.push({ name: "index" });
      }

      // if (this.userInfo.depart_code ) {
      //   // 有用户身份信息
      //   let res = await this.$ajax.userActListHost({
      //   openid: this.openid,
      //   ...this.params,
      //   });
      //   if (res.code == 1) {
      //     this.hotlList = res.data;
      //     this.$set(this.params, "total", res.total);
      //   }  else {
      //     this.$toast(res.msg);
      //     this.$router.push({ name: "index" });
      //   }
      // }else{
      //   // 没有用户身份信息
      //   let res = await this.$ajax.ActivityListHost({
      //   openid: this.openid,
      //   ...this.params,
      //   });
      //   if (res.code == 1) {
      //     this.hotlList = res.data;
      //     this.$set(this.params, "total", res.total);
      //   }  else {
      //     this.$toast(res.msg);
      //     this.$router.push({ name: "index" });
      //   }
      // }
    },

    refresDistrictList() {
      this.aparams.pages = 1;
      this.onDistrictList();
    },
    /*地区分页*/
    async getDistrictList(loaddata, nodata) {
      this.aparams.pages += 1; //
      if (
        this.aparams.pages > Math.ceil(this.params.total / this.aparams.limits)
      ) {
        nodata();
      } else {
        let res = await this.$ajax.actSigninList({
          openid: this.openid,
          level: 0,
          ...this.aparams,
        });
        if (res.code == 1) {
          // 有新数据
          loaddata();
          this.$nextTick(() => {
            this.districtList = this.districtList.concat(res.data);
          });
        } else {
          this.$toast(res.msg);
        }
      }
    },

    /*地区活动*/
    async onDistrictList() {
      let res = await this.$ajax.actSigninList({
        openid: this.openid,
        level: 0,
        ...this.aparams,
      });
      if (res.code == 1) {
        this.districtList = res.data;
      } else {
        this.$toast(res.msg);
      }
    },
    refreshCampusList() {
      this.sparams.pages = 1;
      this.onCampusList(); //校园
    },
    /*校园活动分页*/
    async getcampusList(loaddata, nodata) {
      this.sparams.pages += 1; //
      if (
        this.sparams.pages > Math.ceil(this.sparams.total / this.sparams.limits)
      ) {
        nodata();
      } else {
        let res = await this.$ajax.actSigninList({
          openid: this.openid,
          level: this.level,
          ...this.sparams,
        });
        if (res.code == 1) {
          // 有新数据
          loaddata();
          this.$nextTick(() => {
            this.campusList = this.campusList.concat(res.data);
          });
        } else {
          this.$toast(res.msg);
          this.$router.push({ name: "index" });
        }
      }
    },
    /*校园活动*/
    async onCampusList() {
      this.level = "4";
      let res = await this.$ajax.actSigninList({
        openid: this.openid,
        level: this.level,
        ...this.sparams,
      });
      if (res.code == 1) {
        this.campusList = res.data;
      } else {
        this.$toast(res.msg);
      }
    },

    /*查看所有地区疾控单位*/
    goDistrict() {
      this.$router.push({ name: "jKongList" });
    },
    /*查看所有高校*/
    goAllSchool() {
      this.$router.push({ name: "schoolList" });
    },

    /*校园活动*/
    campusActivity(item) {
      var s = item.depart_code + "-" + item.id;
      this.$router.push({ name: "eventDetails", query: { s: s } });
    },
    /*获取用户信息*/
    async getUserInfo() {
      let res = await this.$ajax.getPersoninfo({
        openid: this.openid,
      });
      if (res.code == 1) {
        this.changeUserInfo(res.data);
        this.getHotList(); //热门活动列表
      } else {
        this.getHotList(); //热门活动列表
      }
    },
  },
  mounted() {
    this.openid = $.cookie("openid");
    this.activeType = this.$route.query.activeType;
    if (this.activeType == 1) {
      // 热门活动
      this.activeName = "a";
      this.getHotList(); //热门活动列表
    } else if (this.activeType == 2) {
      // 地区活动
      this.activeName = "b";
      this.onDistrictList(); //地区
    } else if (this.activeType == 3) {
      this.activeName = "c";
      this.onCampusList(); //校园
    }
    this.getHotList(); //热门活动列表
  },
  created() {
    this.$bus.$on("reload", this.getHotList);
  },
};
</script>
  
<style lang="scss" scoped>
.tabs-style {
  width: 100%;
  margin-top: 40px;
  top: 0;
  left: 0;
  position: fixed;
  z-index: 10;
}
.tab-style {
  background-color: #f4f4f4;
  padding-bottom: 50px;
}

.activityList {
  background-color: #f4f4f4;
  min-height: 100vh;
  height: 100%;
  .list-box {
    margin-top: 15px;
  }
  .allregions {
    font-size: 12px;

    padding: 13px 0px 0px 11px;
    .school-name {
      color: rgba(64, 149, 229, 1);

      text-align: left;
      font-family: SourceHanSansSC-regular;
    }
    .btn-style {
      margin-right: 10px;
    }
  }
  .district-box {
    // margin-top: 15px;
  }
}
.form-style {
  margin-top: 20px;
  ::v-deep .el-form-item__content {
    margin-left: 0px !important;
    .el-select {
      width: 95%;
    }
  }
}
.el-date-editor.el-input {
  width: 95%;
}
</style>